<template>
  <div class="order-page">
    <headBar  isBack="show">
      <div slot="xm-header-center">
        <div class="xm-header-title" >采购申请</div>
      </div>
      <div slot="xm-header-right"></div>
    </headBar>
    <div class="order-group sub-id" v-for="item in data.purchaseItem">
      <div class="flex flex-pack-justify consignee-info">
        <div>收货人：{{item.contacts}}</div>
        <div>{{item.phone}}</div>
      </div>
      <p class="address-info border-bottom">收货地址：{{item.addressName}}</p>
      <div class="order-info">
        <p class="flex-box">
          <span class="flex-one">总价：<b class="color-money">￥</b><i class="price">{{item.amountTotal || 0 | money}}</i></span>
          <span class="flex-one">商品种类：{{item.totalQuantity}}种</span>
        </p>
        <p class="flex-box">
          <span class="flex-one color-gary">来源：{{item.nameSub}}</span>
          <span class="flex-one color-gary">{{item.supplierName}} <a class="detail" @click="toDetail(item.addressId)">详细</a></span>
        </p>
      </div>
    </div>
    <div class="opt-group check-opt flex border-top border-bottom">
      <p class="total-money  ck-price">总金额：<b class="color-money">￥</b> <i class="color-1 price">{{amountTotal || 0 | money}}</i></p>
      <div class="btn2 btn-width2 flex-1" @click="showReject">不同意</div>
      <div class="btn3 btn-width2 flex-1" @click="modifyExa(3)">同意</div>
    </div>
    <div class="reject-group" v-show="isReject">
      <div class="reject">
        <textarea name="" id="" cols="30" rows="10" placeholder="请输入不同意采购的原因" v-model="cause"></textarea>
        <div class="opt-group flex">
          <div class="flex-1" @click="showReject">取消</div>
          <div class="flex-1 btn1" @click="refused">确定</div>
        </div>
      </div>
    </div>
    <div class="fade" v-show="isReject" @click="showReject"></div>
  </div>
</template>
<script>
  export default {
    props: {},
    data() {
      return {
        userIdSub: '',
        addressId: '',
        addressIds: [],
        isReject: false,
        cause: '',
        nameSub: '',
        amountTotal: 0,
        data: {}
      };
    },
    methods: {
      showReject(){
        this.isReject = !this.isReject;
      },
      //不同意
      refused(){
        this.showReject();
        this.modifyExa(4);
      },
      /**
       * 修改采购单状态 <number> 3:同意 4：拒绝
       * */
      modifyExa(type){
        let params = {
          addressIds: this.addressIds.join(','),
          auditRemark: this.cause,
          nameSub: this.nameSub,
          statusAudit: type,
          userIdSub: this.userIdSub
      }
        pruchaseModifyExa(params).then(data=>{
            if(data.returnCode == '000000'){
              this.$router.push({name: 'examine'});
            }
        });
      },
      purchaseList(){
        exaPurchase({userIdSub: this.userIdSub, addressId: this.addressId}).then(data=>{
          if(data.returnCode == '000000'){
            this.data = data.result;
            this.amountTotal = 0;
            [].forEach.call(data.result.purchaseItem, item=>{
                this.amountTotal += (item.amountTotal||0);
                this.addressIds.push(item.addressId);
                this.nameSub = item.nameSub;
            })
          }
        })
      },
      toDetail(addressId){
        this.$router.push({name: 'checkPurchaseDetail', params: {addressId: addressId, type: 2}});
      }
    },
    filters: {},
    created() {
      this.userIdSub = this.$route.params.userIdSub;
      this.addressId = this.$route.params.addressId;
      this.purchaseList();
    },
    mounted(){

    },
    components: {
    }
  };
</script>
<style lang="less">
  @import "./purchase.less";
  .check-opt{
    bottom: 0 !important;
  }
</style>
